<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>上架中的货品</title>
    <link type="text/css" rel="stylesheet" href="./layui/css/layui.css"/>
    <style rel="stylesheet" type="text/css">
        .right{
            margin-right: 5px;
            text-align: center;
        }
    </style>
</head>
<div class="edit" style="display: none;">
    <div class="layui-form-item">
        <label class="layui-form-label">货品名称</label>
        <div class="layui-input-block">
            <input type="text" required lay-verify="required" placeholder="请输入货品" autocomplete="off"
                   class="layui-input edit-pname" style="width: 200px">
            <label class="layui-form-label"></label>
        </div>
    </div>

    <div class="layui-form-item">
        <label class="layui-form-label">货品售价</label>
        <div class="layui-input-block">
            <input type="text" required lay-verify="required" placeholder="请输入售价" autocomplete="off"
                   class="layui-input edit-psaleprice" style="width: 200px">
            <label class="layui-form-label"></label>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">货品余量</label>
        <div class="layui-input-block">
            <input type="text" required lay-verify="required" placeholder="请输入货品余量" autocomplete="off"
                   class="layui-input edit-pcount" style="width: 200px">
            <label class="layui-form-label"></label>
        </div>
    </div>

    <div class="layui-form-item">
        <div class="layui-input-block">
            <button class="layui-btn  save">保存修改</button>
            <button type="layui-btn" class="layui-btn layui-btn-primary cancel">取消修改</button>
        </div>
    </div>
</div>

<body class="layui-layout-body">
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
    <legend>上架中的货品</legend>
</fieldset>

<table id="product" lay-filter="test"></table>
<script type="text/html" id="toolBar">
    <a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="edit">编辑上架信息</a>
    <a class="layui-btn layui-btn-xs" lay-event="offsale">下架货品</a>
    <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="return">货品退货</a>
</script>

<script  type="text/javascript" src="./layui/layui.all.js"></script>
<script>
    var $ = layui.jquery;
    var table = layui.table;
    var element = layui.element;
        table.render({
            elem: '#product'
            , height: 500
            , url: '/selectonsaleproduct.action' //数据接口
            , cols: [[ //表头
                {field: 'pid', title: 'ID', width: 80, sort: false, fixed: 'left'}
                , {field: 'pname', title: '货品名称', width: 190}
                , {field: 'pgetprice', title: '货品进价', width: 150, sort: false}
                , {field: 'psaleprice', title: '货品售价', width: 200, sort: false}
                , {field: 'pduetime', title: '过期时间', width: 240, sort: false}
                , {field: 'pcount', title: '货品余量', width: 120, sort: false}
                , {width: 300, title: '常用操作', align: 'center', toolbar: '#toolBar', fixed: 'right'}

            ]]
            ,page : true
        });
</script>
<script>
    //监听工具条
    table.on('tool(test)', function (obj) {
        if(obj.event == 'edit'){
            var data = obj.data;
            layer.open({
                type: 1,
                skin: 'layui-layer-demo', //样式类名
                closeBtn: 1, //不显示关闭按钮
                shadeClose: true, //开启遮罩关闭
                area: ['400px', '400px'],
                content: $('.edit'),
                success: function (layero, index) {
                    $(".edit-pname").val(data.pname);
                    $(".edit-psaleprice").val(data.psaleprice);
                    $(".edit-pcount").val(data.pcount);
                    $(".save").click(function () {


                    });

                    //关闭窗口
                    $(".cancel").click(function () {
                        layer.closeAll();
                    });

                }
            });


            $(".save").click(function () {
                $.ajax({
                    url: "/editsale.action",
                    type: "POST",
                    data: {
                        pid: data.pid,
                        pname: $(".edit-pname").val(),
                        pgetprice:  data.pgetprice,
                        psaleprice: $(".edit-psaleprice").val(),
                        pduetime: data.pduetime,
                        pcount: $(".edit-pcount").val(),
                        pstatus: data.pstatus
                    }
                }).done(function (data) {
                    if (data.msg == "编辑成功") {
                        layer.msg("编辑成功!");
                        setInterval("layer.closeAll()", 300);
                    }
                });
            });
        } else if (obj.event === 'offsale') {
            var data = obj.data;
            console.log(data.pid);
            layer.confirm('真的要下架该商品吗?', function (index) {
                $.ajax({
                    "url": "/offsale.action?pid=" + data.pid,
                });
                obj.del();
                layer.close(index);
            });
        } else if (obj.event === 'return') {
            var data = obj.data;
            console.log(data.pid);
            layer.confirm('真的要退货该商品吗?', function (index) {
                $.ajax({
                    "url": "/productreturn.action?pid=" + data.pid,
                });
                obj.del();
                layer.close(index);
            });

        }
    });
</script>
</body>
</html>